﻿<DemoPageSectionComponent Id="DialogsAndWindows-DropDown-Customization" ShowSizeMode="true">
    <ChildContentWithParameters Context="Params">
        <div id="dropdown-customization-target-container">
            <DxButton
                Click="() => IsOpen = !IsOpen"
                RenderStyle="@ButtonRenderStyle.Secondary">SHOW A DROPDOWN</DxButton>
        </div>
        <DxDropDown
            @bind-IsOpen="@IsOpen"
            MinWidth="max(25vw, 250px)"
            PositionMode="DropDownPositionMode.Bottom"
            PositionTarget="#dropdown-customization-target-container"
            RestrictionTarget="#Navigation-DropDown-Customization"
            CloseMode="DropDownCloseMode.Close"
            PreventCloseOnPositionTargetClick="true"
            HeaderVisible="true"
            HeaderText="Edit Contact"
            FooterVisible="true"
            SizeMode="Params.SizeMode">
            <BodyContentTemplate>
                <SampleEditForm/>
            </BodyContentTemplate>
            <FooterContentTemplate>
                <DxButton CssClass="popup-button my-1 ms-2" RenderStyle="ButtonRenderStyle.Primary" Text="OK" Click="@context.CloseCallback"/>
                <DxButton CssClass="popup-button my-1 ms-2" RenderStyle="ButtonRenderStyle.Secondary" Text="Cancel" Click="@context.CloseCallback"/>
            </FooterContentTemplate>
        </DxDropDown>
    </ChildContentWithParameters>

    @code {
        bool IsOpen { get; set; } = false;
    }

</DemoPageSectionComponent>
